window.iScroll = (function(w,d){
    var isMobile = /mobile/gi.test(navigator.userAgent.toLowerCase());
    var events = isMobile ? {
        down: 'touchstart',
        move: 'touchmove',
        up: 'touchend'
    } : {
        down: 'mousedown',
        move: 'mousemove',
        up: 'mouseup'
    },x,y,x2,y2 = 0;
    function Scroll(o){
        this.d = (typeof o=='object') ? o : d.querySelector(o);
        this.mold = this.d.getAttribute('x') || this.d.getAttribute('x')=="";
        this.pSize = this.mold ? 'offsetWidth' : 'offsetHeight'
        this.t = this.mold ? 'scrollWidth' : 'scrollHeight';
        this.page = this.mold ? 'pageX' : 'pageY';
        this.child = this.d.children[0];
        this.view = this.d[this.pSize];
        this.bp =this.mold ? (parseInt(this.getst(this.d,'borderLeftWidth'))+parseInt(this.getst(this.d,'borderRightWidth'))) : (parseInt(this.getst(this.d,'borderTopWidth'))+parseInt(this.getst(this.d,'borderBottomWidth')));
        if(this.child[this.t] > this.view) this.init();
    };
    Scroll.prototype={
        init : function(){
            if( !this.d.querySelector('.scroll-bar') ) this.d.insertAdjacentHTML("beforeend", '<div class="'+(this.mold ? 'scroll-bar scroll-bar2' : 'scroll-bar')+'"><span></span></div>');
            this.bind();
        },
        top : function(fn){
            this.topFn  = fn;
        },
        bottom : function(fn){
            this.bottomFn = fn;
        },
        resize : function(){
            //设置滚动条位置，高度
            this.childSize = this.child[this.t]
            this.scrollSize = this.childSize - this.view + this.bp;
            this.bar = this.d.querySelector('.scroll-bar')
            this.barSize = this.view * this.view / this.child[this.t];
            this.bar.style[this.mold ? 'width' : 'height'] = parseInt(this.barSize)+'px';
            var scale = +this.getT2(this.child)/(this.view - this.child[this.t])*(this.view - this.bar[this.pSize]);
            this.bar.style['transform'] =  this.bar.style['-webkit-transform'] = this.mold ?  'translate3d('+( scale )+'px,0px,0)' : 'translate3d(0,'+( scale )+'px,0)';
        },
        bind : function(){
            var that = this,off,late,speed,endPage,moveLate = false,endFlag = false,translate = 0,barLate;
            this.d.addEventListener(events.down,down)
            this.resize();
            function setTransInfo(s,b){
                if(b){
                    that.bar.style['transform'] =  that.bar.style['-webkit-transform'] = that.mold ? 'translate3d('+(b) +'px,0px,0)' : 'translate3d(0,'+(b)+'px,0)';
                };
                that.child.style['transform']  = that.child.style['-webkit-transform'] =that.mold  ? 'translate3d('+(s)+'px,0px,0)' : 'translate3d(0,'+(s)+'px,0)';
            }
            function down(e){
                if(!/^(?:INPUT|TEXTAREA|A)$/.test(e.target.tagName)) e.preventDefault();
                var ev = isMobile ? e.changedTouches[0] : e ;
                y = endPage = ev[that.page];
                that.child.style['transition'] = that.child.style['-webkit-transition'] = that.bar.style['transition'] = that.bar.style['-webkit-transition'] = 'all 0s ease';
                translate = +that.getT2(that.child);
                setTransInfo(translate,+that.getT2(that.bar))
                speed = 0;
                d.addEventListener(events.move,move);
                d.addEventListener(events.up,up);
            };
            function move(e){
                var ev = isMobile ? e.changedTouches[0] : e,_ts=0 ;
                e.preventDefault();
                y2 = ev[that.page];
                late = +that.getT2(that.child);
                speed = ev[that.page] - endPage;
                endPage = ev[that.page];
                moveLate = Math.abs( y2 - y) > 10 ? true : false;
                barLate = ( late/(that.view-that.bp - that.child[that.t])*(that.view-that.bp - that.bar[that.t]) );
                if(late >= 0){
                    if(off){ 
                        y = ev[that.page];
                        off = false;
                        translate = +that.getT2(that.child);
                    };
                    setTransInfo((y2-y)/3+translate,"0");
                    endFlag = true;
                }else if(-late>=that.scrollSize){
                    if(off){ 
                        y = ev[that.page];
                        off = false;
                        translate = +that.getT2(that.child);
                    };
                    setTransInfo( (y2-y)/3 + translate, that.view-that.bp -that.bar[that.pSize] );
                    endFlag = true;
                }else{
                    if(!off) {
                        translate = +that.getT2(that.child);
                        off = true;
                    };
                    endFlag = false;
                    setTransInfo( y2-y+translate,barLate );
                };
            };
            function up(e){
                off = true;
                var scales = +that.getT2(that.child);
                var endPx = speed*25 + scales;
                d.removeEventListener(events.move,move);
                d.removeEventListener(events.up,up);
                if(moveLate && endFlag){
                    moveLate = false
                    that.d.addEventListener('transitionend',fn,false);
                    that.d.addEventListener('webkitTransitionEnd',fn,false);
                };
                function fn(ev){
                    if(+that.getT2(that.child)==0){
                        that.topFn && that.topFn.call(that.d,scales,0);
                    }else{
                        that.bottomFn && that.bottomFn.call(that.d,scales,+that.getT2(that.child));
                    };
                    that.d.removeEventListener('transitionend',fn);
                    that.d.removeEventListener('webkitTransitionEnd',fn);
                };
                barLate = ( endPx/(that.view-that.bp - that.child[that.t])*(that.view-that.bp -  that.bar[that.t]) )
                that.child.style['transition'] =that.child.style['-webkit-transition'] =that.bar.style['transition'] =that.bar.style['-webkit-transition'] ='transform .7s cubic-bezier(0.33, 0.66, 0.66, 1)';
                if(endPx > 0){
                    setTransInfo(0,"0");
                }else if(-endPx>= that.scrollSize){
                    setTransInfo(-that.scrollSize,that.view-that.bp -that.bar[that.pSize]);
                }else{
                    setTransInfo(endPx,barLate);
                }
                e.stopImmediatePropagation();
            };
        },
        getT2 : function(obj) {
            var curStyle = window.getComputedStyle(obj, null),cur=0,matrix,tmx;
            if (window.WebKitCSSMatrix) {
                cur = curStyle.transform || curStyle.webkitTransform;
                if (cur.split(',').length > 6) {
                    cur = cur.split(', ').map(function(a){
                        return a.replace(',','.');
                    }).join(', ');
                }
                tmx = new window.WebKitCSSMatrix(cur === 'none' ? '' : cur);
            }
            else {
                tmx = curStyle.MozTransform || curStyle.OTransform || curStyle.MsTransform || curStyle.msTransform  || curStyle.transform || curStyle.getPropertyValue('transform').replace('translate(', 'matrix(1, 0, 0, 1,');
                matrix = tmx.toString().split(',');
            }
            if (this.mold) {
                if (window.WebKitCSSMatrix)
                    cur = tmx.m41;
                else if (matrix.length === 16)
                    cur = parseFloat(matrix[12]);
                else
                    cur = parseFloat(matrix[4]);
            }else{
                if (window.WebKitCSSMatrix)
                    cur = tmx.m42;
                else if (matrix.length === 16)
                    cur = parseFloat(matrix[13]);
                else
                    cur = parseFloat(matrix[5]);
            }
            return cur || 0;
        },
        getst : function (obj,attr){
            return getComputedStyle(obj,null)[attr];
        }
    };
    return Scroll;
})(window,document);